<template>
  <div class="app-container">
    <el-button v-if="isAdmin" type="primary" class="buiButton" :loading="loading" @click="onSubmit('success')">通过</el-button>
    <el-button v-if="isAdmin" class="buiButton" style="right: 230px" :loading="loading" @click="dialogFormVisible=true">拒绝</el-button>
    <el-tabs v-model="activeName">
      <el-tab-pane label="基本信息" name="1">
        <basicAudit v-if="isAdmin" :form="data"/>
        <basic v-else :form="data"/>
      </el-tab-pane>
      <el-tab-pane label="相册信息" name="2">
        <albumAudit v-if="isAdmin" :albums="data.albums"/>
        <album v-else :data="data" />
      </el-tab-pane>
    </el-tabs>
    <el-dialog title="原因" :visible.sync="dialogFormVisible">
      <el-form ref="form" :model="form" :rules="rules">
        <el-form-item  prop="reason">
          <el-input :autosize="{minRows:3}" type="textarea" maxlength="100" show-word-limit v-model="form.reason"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" :loading="loading" @click="failed()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import basic from './basic.vue'
  import basicAudit from './basicAudit.vue'
  import album from './album.vue'
  import albumAudit from './albumAudit.vue'
  import { detail,updateAlbums,check } from '@/api/building'
  import { getToken } from '../../utils/auth'
  import { parseTime } from '@/utils/index'
  export default {
    data() {
      return {
        isAdmin:localStorage.getItem('role')=='admin',
        activeName: '1',
        data:{},
        dialogFormVisible:false,
        loading:false,
        reason:'',
        form:{
          reason:'',
        },
        rules:{
          reason: [
              { required: true, message: '请输入原因', trigger: 'blur' },
            ]
        }
      }
    },
    components: {
      basic,
      basicAudit,
      album,
      albumAudit
    },
    created(){
      this.fetchData()
    },
    methods: {
      fetchData() {
        detail({targetId:this.isAdmin?this.$route.query.id:null,token:getToken()}).then(res => {
          this.data=res.data
          this.data.token=getToken()
          this.data.managerId=this.data.manager.id
          this.data.buildingId=this.data.id
          this.data.time=(this.data.openTime?parseTime(this.data.openTime,'{y}-{m}-{d}') :'')
          this.data.time1=(this.data.sincerStartTime?parseTime(this.data.sincerStartTime,'{y}-{m}-{d}') :'')
          this.data.time2=(this.data.sincerEndTime?parseTime(this.data.sincerEndTime,'{y}-{m}-{d}') :'')
          this.data.time3=(this.data.sincerThawTime?parseTime(this.data.sincerThawTime,'{y}-{m}-{d}') :'')

        })
      },
      failed(){
        this.$refs.form.validate((valid) => {
          if (valid) {
            this.onSubmit('failed')
          }
        });

    },
      onSubmit(status){
        this.loading=true
        check({changeTo:status,targetId:this.data.id,reason:this.form.reason,token:getToken()}).then(res=>{
          this.$message.success('审核成功')
          this.$router.go(-1)
        }).finally(
          this.loading=false
        )
      }
    }
  }
</script>

<style scoped>
  .line {
    text-align: center;
  }
  .buiButton{
    position: fixed;
    top:120px;
    right: 150px;
    z-index:1000
  }
</style>

